<template>
    <Layout>
        <Form ref="form1" :model="form1" :label-width="120">
            <Row class="query-form">
                <Col span="8">
                    <FormItem label="企业名称：">
                        <Input type="text" v-model="form1.contractorName"/>
                    </FormItem>
                </Col>
                <Col span="8" offset="8">
                    <Button @click="reset" class="ivu-btn-reset">重置</Button>
                    <Button class="ivu-btn-query" icon="md-search" @click="query()">查询</Button>
                </Col>
            </Row>
             <Row class="query-form">
                 <Col span="24">
                     <Button size="large" class="ivu-btn-add" icon="md-add" @click="addInfo">新增</Button>
                 </Col>
             </Row>
        </Form>
        <Table ref='table' :height="tableHeight" :loading="loading" class="no-add-table" no-data-text="没有查询到相关数据!"
               highlight-row stripe border :columns="columns1" width="100%" :data="dataTable" size="small">
        </Table>
        <Row style="margin-right:10px;">
            <Col span="24">
                <Page :total="pagedata.total" :page-size="pagedata.pageSize" @on-change="pageChange"
                      style="float: right" @on-page-size-change="pageSizeChange" :page-size-opts="pageSizeArray"
                      show-total show-sizer show-elevator/>
            </Col>
        </Row>

        <Modal :transfer=false v-model="model1" :width=700 title='相关方信息' @on-cancel="onCancel">
            <Form ref='InputData' :model="InputData" :rules="ruleCustom" label-position="top">
                <Row style="line-height: 28px;margin-left: 15px">
                    <Col span='23'>
                        <FormItem label='企业名称：' prop="contractorName">
                            <Input v-model="InputData.contractorName"/>
                        </FormItem>
                    </Col>
                    <Col span='11'>
                        <FormItem label='经营范围：'>
                            <Input v-model="InputData.bizRangeName"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='企业性质：' prop="propertyName">
                            <Input v-model="InputData.propertyName"/>
                        </FormItem>
                    </Col>
                    <Col span='11'>
                        <FormItem label='法定代表人：' prop="legalPerson">
                            <Input v-model="InputData.legalPerson"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='注册资本：' prop="capital">
                            <Input v-model="InputData.capital"/>
                        </FormItem>
                    </Col>
<!--                    <Col span='11'>
                        <FormItem label='单位负责人：' prop="headUnit">
                            <Input v-model="InputData.headUnit"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='负责人电话：' prop="headUnitPhone">
                            <Input v-model="InputData.headUnitPhone"/>
                        </FormItem>
                    </Col>-->
                    <Col span='11'>
                        <FormItem label='统一社会信用代码：' prop="unifyCode">
                            <Input v-model="InputData.unifyCode"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='客商类型：'>
                            <Input v-model="InputData.customerType"/>
                        </FormItem>
                    </Col>
                    <Col span='11'>
                        <FormItem label='行业分类：'>
                            <Input v-model="InputData.industryCategory"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='客商状态：'>
                            <Input v-model="InputData.customerStatus"/>
                        </FormItem>
                    </Col>
                    <Col span='11'>
                        <FormItem label='客商资质：'>
                            <Input v-model="InputData.customerQualifications"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='资质状态：'>
                            <Select v-model="InputData.qualificationStatus">
                                <Option value="1">有效</Option>
                                <Option value="2">无效</Option>
                            </Select>
                            <!--<Input v-model="InputData.qualificationStatus"/>-->
                        </FormItem>
                    </Col>
                 <!--   <Col span='11'>
                        <FormItem label='特种作业人员上岗证数量：'>
                            <InputNumber style="width:100%"
                                         v-model="InputData.workLicenseNumber"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='特种作业人员数量：'>
                            <InputNumber style="width:100%"
                                         v-model="InputData.workerNumber"/>
                        </FormItem>
                    </Col>
                    <Col span='11'>
                        <FormItem label='施工负责人：'>
                            <Input v-model="InputData.constructionDirector"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='施工负责人电话：'>
                            <Input v-model="InputData.constructionDirectorPhone"/>
                        </FormItem>
                    </Col>
                    <Col span='11'>
                        <FormItem label='施工单位安全员：'>
                            <Input v-model="InputData.safetyOfficer"/>
                        </FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label='施工单位安全员电话：'>
                            <Input v-model="InputData.safetyOfficerPhone"/>
                        </FormItem>
                    </Col>-->
                </Row>
                <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                     <Col span="23">
                         <FormItem>
                             <Button class='ivu-btn-save' :loading="buttonLoading" @click="submit('InputData')">确定</Button>
                             <Button class='ivu-btn-cancel' @click="onCancel">取消</Button>
                         </FormItem>
                     </Col>
                 </Row>-->
            </Form>
            <div slot="footer">
                <Button class='ivu-btn-save' :loading="buttonLoading" @click="submit('InputData')">确定</Button>
                <Button class='ivu-btn-cancel' @click="onCancel">取消</Button>
            </div>
        </Modal>


        <Modal :transfer=false v-model="model2" :width=800 title='相关方信息' @on-cancel="onCancel">
            <Form :model="InputData" :label-width="140" class="modal-view-detail">
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='23'>
                        <FormItem label='企业名称：'>
                        {{InputData.contractorName}}
                        </FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="法定代表人：">{{InputData.legalPerson}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="注册资本：">{{InputData.capital}}</FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='23'>
                        <FormItem label="经营范围：">{{InputData.bizRangeName}}</FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="客商类型：">{{InputData.customerType}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="客商状态：">{{InputData.customerStatus}}</FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="统一社会信用代码：">{{InputData.unifyCode}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="企业性质：">{{InputData.propertyName}}</FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="行业分类：">{{InputData.industryCategory}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                    </Col>
                </Row>
<!--                <Row type="flex" justify="space-around" class="code-row-bg">-->
<!--                    <Col span='11'>-->
<!--                        <FormItem label="单位负责人：">{{InputData.headUnit}}</FormItem>-->
<!--                    </Col>-->
<!--                    <Col span='11' offset="1">-->
<!--                        <FormItem label="负责人电话：">{{InputData.headUnitPhone}}</FormItem>-->
<!--                    </Col>-->
<!--                </Row>-->
               <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="特种作业人员上岗证数量：">{{InputData.workLicenseNumber}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="特种作业人员数量：">{{InputData.workerNumber}}</FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="施工负责人：">{{InputData.constructionDirector}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="施工负责人电话：">{{InputData.constructionDirectorPhone}}</FormItem>
                    </Col>
                </Row>
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="施工单位安全员：">{{InputData.safetyOfficer}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="施工单位安全员电话：">{{InputData.safetyOfficerPhone}}</FormItem>
                    </Col>
                </Row>-->
                <Row type="flex" justify="space-around" class="code-row-bg">
                    <Col span='11'>
                        <FormItem label="客商资质：">{{InputData.customerQualifications}}</FormItem>
                    </Col>
                    <Col span='11' offset="1">
                        <FormItem label="资质状态：">{{InputData.qualificationStatus=='1'?'有效':InputData.qualificationStatus=='2'?'无效':''}}</FormItem>
                    </Col>
                </Row>
                <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                     <Col span="23">
                         <FormItem>
                             <Button class='ivu-btn-save' @click="onCancel">关闭</Button>
                         </FormItem>
                     </Col>
                 </Row>-->
            </Form>
            <div slot="footer">
                <Button class='ivu-btn-save' @click="onCancel">关闭</Button>
            </div>
        </Modal>
    </Layout>
</template>

<script>
import {Api} from '../../../api/index.js'
import {sessionStorage} from '../../../common/cacheUtils.js';

export default {
        name: "interestedPartiesAccount",
        data() {
            return {
                tableHeight: '', loading: false,
                form1: {
                    contractorName: '',
                },
                pageSizeArray: [10, 20, 50],
                pagedata: {
                    total: 0,
                    pageSize: 10,
                    currentPage: 1,
                },
                ruleCustom: {
                    contractorName: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],

                    legalPerson: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    capital: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    unifyCode: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    propertyName: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    headUnit: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    headUnitPhone: [{
                        validator: (rule, value, callback) => {
                            let reg = /^1[0-9]{10}$/;
                            if (value === '' || value === undefined || value == null) {
                                callback(' ')
                            } else {
                                if (reg.test(value)) {
                                    callback();
                                } else {
                                    callback(' ');
                                }
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    workLicenseNumber: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else if (value < 0) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    workerNumber: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else if (value < 0) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    constructionDirector: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    constructionDirectorPhone: [{
                        validator: (rule, value, callback) => {
                            let reg = /^1[0-9]{10}$/;
                            if (value === '' || value === undefined || value == null) {
                                callback(' ')
                            } else {
                                if (reg.test(value)) {
                                    callback();
                                } else {
                                    callback(' ');
                                }
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    safetyOfficer: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    safetyOfficerPhone: [{
                        validator: (rule, value, callback) => {
                            let reg = /^1[0-9]{10}$/;
                            if (value === '' || value === undefined || value == null) {
                                callback(' ')
                            } else {
                                if (reg.test(value)) {
                                    callback();
                                } else {
                                    callback(' ');
                                }
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    qualificationStatus: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],

                    bizRangeName: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    customerType: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    industryCategory: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    customerStatus: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                    customerQualifications: [{
                        validator: (rule, value, callback) => {
                            if (value == null || value == '' || value == undefined) {
                                callback(' ')
                            } else {
                                callback()
                            }
                        },
                        required: true,
                        trigger: 'change'
                    }],
                },
                dataTable: [],
                columns1: [
                    {
                        title: "序号",
                        width: 80,
                        align: "center",
                        fixed: 'left',
                        render: (h, params) => {
                            return h('span', params.index + (this.pagedata.currentPage - 1) * this.pagedata.pageSize + 1);
                        }
                    },
                    {
                        minWidth: 150,
                        title: '企业名称',
                        align: 'center',
                        key: 'contractorName',
                    },
                    /* {
                         minWidth: 150,
                         title: '企业性质',
                         align: 'center',
                         key: 'propertyName',
                     },*/
                    {
                        minWidth: 150,
                        title: '法定代表人',
                        align: 'center',
                        key: 'legalPerson',
                    },
                    {
                        minWidth: 150,
                        title: '注册资本',
                        align: 'center',
                        key: 'capital',
                    },
                  /*  {
                        minWidth: 150,
                        title: '单位负责人',
                        align: 'center',
                        key: 'headUnit',
                    },
                    {
                        minWidth: 150,
                        title: '单位负责人电话',
                        align: 'center',
                        key: 'headUnitPhone',
                    },*/
                    {
                        title: '操作',
                        key: 'action',
                        fixed: 'right',
                        width: 200,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                    },
                                    on: {
                                        click: () => {
                                            this.InputData = params.row;
                                            this.model2 = true;
                                        }
                                    }
                                }, '详情'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                        color: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId )||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                            ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined)? '':'#d0d0d0' ,
                                        pointerEvents: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId )||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                            ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined) ? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.InputData = JSON.parse(JSON.stringify(params.row));
                                            this.model1 = true;
                                            this.add = false;
                                        }
                                    }
                                }, '修改'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px',
                                        color: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId )||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                            ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined)? 'red':'#d0d0d0' ,
                                        pointerEvents: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId )||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                            ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined)? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.deleteData(params.row);
                                        }
                                    }
                                }, '删除')
                            ]);
                        }
                    }
                ],
                model1: false,
                model2: false,
                add:false,
                buttonLoading: false,
                InputData: {},
            }
        },
        mounted() {
            this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 145;
            this.query()
        },
        methods: {
            addInfo() {
                this.add = true;
                this.InputData = {};
                this.model1 = true;
            },
            submit(name) {
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        this.buttonLoading = true
                        if (this.add) {
                            let url = Api.interestedPartiesAccountAdd
                            this.$http.post(url, this.InputData).then((res) => {
                                this.$Message.success('成功');
                                this.query()
                                this.buttonLoading = false
                                this.model1 = false
                            }).catch(e => {
                                this.$Message.error('请求失败');
                            })
                        } else {
                            let url = Api.interestedPartiesAccountUpdate;
                            this.InputData.updateUserId = sessionStorage('userId').getObject('userId').userId
                            this.InputData.updateOrgId = sessionStorage('userId').getObject('userId').orgInfo.orgId
                            this.$http.post(url, this.InputData).then((res) => {
                                this.$Message.success('成功');
                                this.buttonLoading = false
                                this.model1 = false
                                this.query()
                            }).catch(e => {
                                this.$Message.error('请求失败');
                            })
                        }
                    } else {
                        this.$Message.error('失败!');
                    }
                })

            },

            deleteData(row) {
                this.$Modal.confirm({
                    title: '提示',
                    content: '<p>确认删除此行数据？</p>',
                    onOk: () => {
                        let url = Api.interestedPartiesAccountDelete + '/' + row.contractorId
                        this.$http.delete(url).then((res) => {
                            this.$Message.success('成功');
                            this.query()
                        }).catch(e => {
                            this.$Message.error("数据获取失败")
                        })
                    },
                    onCancel: () => {
                    }
                });
            },

            onCancel() {
                this.InputData = {}
                this.model1 = false
                this.model2 = false
                this.query()
            },
            query() {
                this.loading = true;
                let data = {
                    startPage: this.pagedata.currentPage,
                    size: this.pagedata.pageSize
                }
                data = Object.assign(data, JSON.parse(JSON.stringify(this.form1)));
                let url = Api.interestedPartiesAccountList
                this.$http.get(url, {params: data}).then((res) => {
                    console.log(res.data);
                    this.dataTable = res.data.data.data;
                    this.pagedata.total = res.data.data.totalSize;
                    this.loading = false;
                }).catch(e => {
                    this.$Message.error("数据获取失败")
                })
            },
            reset() {
                this.form1 = {
                    contractorName: ''
                }
                this.pagedata.currentPage=1
                this.query()
            },
            pageChange(pageNum) {
                this.pagedata.currentPage = pageNum;
                this.query();
            },
            pageSizeChange(pageSize) {
                this.pagedata.pageSize = pageSize;
                this.query();
            },
        }
    }
</script>

<style scoped>
    @import '../../../index.css';
</style>
